<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="sf"%>

<c:set var="ctx" value="${pageContext.request.contextPath }" />
<link rel="stylesheet"
	href="${ctx }/resources/js/select2/select2.min.css" />

<script type="text/javascript"
	src="${ctx }/resources/js/select2/select2.min.js"></script>
<script type="text/javascript"
	src="${ctx }/resources/js/select2/zh-CN.js"></script>
<script type="text/javascript">
	$(function() {
		webside.form.series.validateSeriesForm();
	})
	var type = "${seriesEntity.type}";
	var typearr = type.split(",");
	var types = $(".types");

	for (var i = 0; i < typearr.length; i++) {
		for (var j = 0; j < types.length; j++) {
			if (typearr[i] == types.eq(j).val()) {
				types.eq(j).attr("checked", "checked")
				break;
			}
			;
		}
	}
</script>

<%-- <script src="${basePath}/script/ajaxfileupload.js" type="text/javascript"></script>
  --%>

<script src="${ctx }/resources/js/upload/ajaxfileupload.js"
	type="text/javascript">
	
</script>
<style>
textarea {
	padding: 0px;
}
</style>
<script type="text/javascript">
	$(window).on('load', function() {
		$('#type').selectpicker({
			'selectedText' : 'cat'
		});
	});
	function fun() {
		var select = document.getElementById("type");
		var str = [];
		for (i = 0; i < select.length; i++) {
			if (select.options[i].selected) {
				str.push(select[i].value);
			}
		}

	}
	function limitChars() {
		var obj = document.getElementById("#summary");
		if (obj.value.length > 1000) {
			obj.value = obj.value.substr(0, 1000);
		}
	}

	function moveOption(e1, e2) {
		var fromObjOptions = e1.options;
		for (var i = 0; i < fromObjOptions.length; i++) {
			if (fromObjOptions[i].selected) {
				e2.appendChild(fromObjOptions[i]);
				i--;
			}
		}
		document.myform.city.value = getvalue(document.myform.list2);
	}

	function doSaveCover() {
		var fileName = $("#cover").val();
		var type = fileName.split(".");
		var ftype = type[type.length - 1]; //获取文件后缀
		$.ajaxFileUpload({
			url : '${ctx }/files/upload/' + ftype,
			secureuri : false, //是否需要安全协议，一般设置为false
			fileElementId : [ 'cover' ], //文件上传域的ID
			dataType : 'json', //返回值类型 一般设置为json
			success : function(data, status) //服务器成功响应处理函数
			{

				if (data.result == 0) {
					var fileId = data.data[0].id;
					var filePath = '/files/view/jpg/' + fileId;
					$("#hiddenCover").val(filePath);
					//显示图片
					$("#imgCover").attr("src",
							'${ctx}/files/view/jpg/' + fileId);
					//显示名字
					$("#labcover").html(data.data[0].name);

				}
			},
			error : function(data, status, e) //服务器响应失败处理函数
			{
				alert(e);
			}
		});

	}

	function doSavePoster() {
		var fileName = $("#poster").val();
		alert("!!!!+++"+fileName);
		var type = fileName.split(".");
		var ftype = type[type.length - 1]; //获取文件后缀

		$.ajaxFileUpload({
			url : '${ctx}/files/upload/' + ftype,
			secureuri : false, //是否需要安全协议，一般设置为false
			fileElementId : [ 'poster' ], //文件上传域的ID
			dataType : 'json', //返回值类型 一般设置为json
			success : function(data, status) //服务器成功响应处理函数
			{

				if (data.result == 0) {
					var fileId = data.data[0].id;
					var filePath = '/files/view/jpg/' + fileId;
					$("#hiddenPoster").val(filePath);
					//显示图片
					$("#imgPoster").attr("src",
							'${ctx }/files/view/jpg/' + fileId);
					//显示名字
					$("#laPoster").html(data.data[0].name);
				}
			},
			error : function(data, status, e) //服务器响应失败处理函数
			{
				alert(e);
			}
		});
	}

	/*二级联动  */
	$(function() {
		$("#channel")
				.change(
						function() {
							$("#addType").html("");
							if($("#channel").val()!= ""){
							$.post(
											"series/getDramaTypes.html?code="
													+ $("#channel").val(),
											function(data, textStatus) {
												var dataObj = eval("(" + data
														+ ")");
												for (var i = 0; i < dataObj.length; i++) {
													$("#addType")
															.append(
																	"<label><input class='types' name='spCodeId' style='width:16px;height:16px;margin-left:5px' type='checkbox' value='"+dataObj[i].code+"'/>"
																			+ dataObj[i].name
																			+ "</label>");
												}
											});
							
							$("#kind option[value!='']").remove();
							$.post("series/getSerieKinds.html?code="
									+ $("#channel").val(), function(data,
									textStatus) {
								var dataObj = eval("(" + data + ")");
								for (var i = 0; i < dataObj.length; i++) {
									var $option = $("<option></option>");
									$option.attr("value", dataObj[i].code);
									$option.text(dataObj[i].name);
									$("#kind").append($option);
								}
							});
						}
						});

		$("#kind").change(function() {

			$("#kindName").val($("#kind").find("option:selected").text());
		});
	});
</script>

<div class="page-header">
	<h1>
		<c:if test="${empty seriesEntity}">
		新增视频
		</c:if>
		<c:if test="${!empty seriesEntity}">
		编辑视频
		</c:if>
	</h1>
</div>
<div class="row" style="margin-top: 5px;">
	<div class="col-xs-12">
		<!--  <form action="series/addinsert.html" id="addUI" name="addUI" class="form-horizontal" role="form" method="post">-->
		<form id="seriesForm" name="seriesForm" class="form-horizontal"
			role="form" method="post">
			<c:if test="${!empty seriesEntity}">
				<input type="hidden" id="pageNum" name="pageNum"
					value="${page.pageNum }">
				<input type="hidden" id="pageSize" name="pageSize"
					value="${page.pageSize }">
				<input type="hidden" id="orderByColumn" name="orderByColumn"
					value="${page.orderByColumn }">
				<input type="hidden" id="orderByType" name="orderByType"
					value="${page.orderByType }">
				<input type="hidden" id='id' name="id" value="${seriesEntity.id }">
			</c:if>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="name">剧集名称</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="name" id="name" type="text"
							value="${seriesEntity.name }" placeholder="剧集名称" />
					</div>
				</div>
			</div>

			<input type="hidden" id='status' name="status"
				value="${seriesEntity.status}">
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right"
					for="description">描述</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="description" id="description"
							type="text" value="${seriesEntity.description }" placeholder="描述"
							maxlength='10' /> <label>最多输入10个字符</label>
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="summary">简介</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<textarea class="form-control" name="summary" id="summary"
							maxlength="1000" placeholder="简介" rows="10" cols="10"
							onmousedown="s(event,this)"
							onchange="this.value=this.value.substring(0, 1000)"
							onkeydown="this.value=this.value.substring(0, 1000)"
							onkeyup="this.value=this.value.substring(0, 1000)">${seriesEntity.summary }</textarea>
						<label>最多只能输入1000个字符否则会输入不了字符，粘贴的会把超出的字符自动取消</label>
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="channel">频道</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<select id="channel" class="form-control" name='channel'>
							<option value=""
								<c:if test="${seriesEntity.channel eq null}">selected="selected"</c:if>>请选择</option>
							<c:forEach items="${list_channel}" var="t">
								<option value="${t.code}"
									<c:if test="${seriesEntity.channel eq t.code}">selected="selected"</c:if>>${t.name}</option>
							</c:forEach>
						</select>

					</div>
				</div>
			</div>


			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="kind">频道的分类</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<select id="kind" class="form-control" name='kind'>
							<c:forEach items="${list_serieKinds}" var="t">
								<option value="${t.code}"
									<c:if test="${seriesEntity.kind eq t.code}">selected="selected"</c:if>>${t.name}</option>
							</c:forEach>
						</select> <input id="kindName" name="kindName" type="hidden"
							value="${seriesEntity.kindName}" />
					</div>
				</div>
			</div>


			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="type">剧情类型</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<div id="addType">
							<c:forEach items="${list_dramaTypes}" var="t">
								<label><input class="types" name='spCodeId'
									style='width: 16px; height: 16px; margin-left: 5px'
									type='checkbox' value='${t.code }' />${t.name }</label>
							</c:forEach>
						</div>
						<input id="type" name="type" type="hidden" value="" /> <input
							id="typeName" name="typeName" type="hidden"
							value="${seriesEntity.typeName}" />
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="tag">标签</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="tag" id="tag" type="text"
							value="${seriesEntity.tag }" placeholder="标签" />
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right"
					for="language">语言</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<select id="language" class="form-control" name='language'>
							<option value=""
								<c:if test="${seriesEntity.language eq null}">selected="selected"</c:if>>请选择</option>
							<c:forEach items="${list_language}" var="t">
								<option value="${t.code}"
									<c:if test="${seriesEntity.language eq t.code}">selected="selected"</c:if>>${t.name}</option>
							</c:forEach>
						</select>

					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="year">年份</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<select id="year" class="form-control" name='year'>
							<option value=""
								<c:if test="${seriesEntity.year eq null}">selected="selected"</c:if>>请选择</option>
							<c:forEach items="${list_years}" var="t">
								<option value="${t.code}"
									<c:if test="${seriesEntity.year eq t.code}">selected="selected"</c:if>>${t.name}</option>
							</c:forEach>
						</select>
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="area">地区</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<select id="area" class="form-control" name='area'>
							<option value=""
								<c:if test="${seriesEntity.area eq null}">selected="selected"</c:if>>请选择</option>
							<c:forEach items="${list_areas}" var="t">
								<option value="${t.code}"
									<c:if test="${seriesEntity.area eq t.code}">selected="selected"</c:if>>${t.name}</option>
							</c:forEach>
						</select>

					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="poster">海报</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="files" id="poster" type="file"
							placeholder="海报" /> <img id="imgPoster" alt=""
							<c:if test="${null eq  seriesEntity.poster}">src="${ctx}/resources/images/xx.png"</c:if>
							<c:if test="${seriesEntity.poster != null}">src="${ctx}${seriesEntity.poster}"</c:if>
							width="175px" height="100px"> <label id="laPoster"></label>
						<input type="button" id="but" onclick="javascript:doSavePoster();"
							value="上传" class="btn btn-primary btn-sm" name="files" /> <input
							type="hidden" id="hiddenPoster" name="poster" />
					</div>
					<label id='m' style='font-family: verdana; color: red'>海报尺寸比例要求16:9，推荐尺寸432
						*248</label>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="cover">封面</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="files" id="cover" type="file"
							value="${seriesEntity.cover}" placeholder="封面" /> <img
							id="imgCover" alt=""
							<c:if test="${null eq  seriesEntity.cover}">src="${ctx}/resources/images/xx.png"</c:if>
							<c:if test="${seriesEntity.cover != null}">src="${ctx}${seriesEntity.cover}"</c:if>
							width="175px" height="100px"> <label id="labcover"></label>
						<input type="button" onclick="javascript:doSaveCover();"
							value="上传" class="btn btn-primary btn-sm" /> <input
							type="hidden" id="hiddenCover" name="cover">
					</div>
					<label id='c' style='font-family: verdana; color: red'>封面推荐尺寸230*329</label>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right"
					for="director">导演</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="director" id="director"
							type="text" value="${seriesEntity.director }" placeholder="导演" />
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="actor">主演</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="actor" id="actor" type="text"
							value="${seriesEntity.actor }" placeholder="主演" />
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="setSum">总集数</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="setSum" id="setSum" type="text"
							value="${seriesEntity.setSum }" placeholder="总集数"
							onkeyup="value=value.replace(/[^(\d)]/g,'')" /> <label>只能输入数字</label>
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right"
					for="playCount">点播数</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="playCount" id="playCount"
							type="text" value="${seriesEntity.playCount }" placeholder="点播数"
							onkeyup="value=value.replace(/[^(\d)]/g,'')" /> <label>只能输入数字</label>
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right"
					for="commentCount">评论数</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="commentCount" id="commentCount"
							type="text" value="${seriesEntity.commentCount }"
							placeholder="评论数" onkeyup="value=value.replace(/[^(\d)]/g,'')" />
						<label>只能输入数字</label>
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right"
					for="commentCount">点赞数</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="likeCount" id="likeCount"
							type="text" value="${seriesEntity.likeCount }" placeholder="点赞数"
							onkeyup="value=value.replace(/[^(\d)]/g,'')" /> <label>只能输入数字</label>
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right"
					for="recommendLevel">推荐等级</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<select id="recommendLevel" class="form-control"
							name='recommendLevel'>
							<option value=""
								<c:if test="${seriesEntity.recommendLevel eq null}">selected="selected"</c:if>>请选择</option>
							<c:forEach items="${list_Position}" var="t">
								<option value="${t.code}"
									<c:if test="${seriesEntity.recommendLevel eq t.code}">selected="selected"</c:if>>${t.name}</option>
							</c:forEach>
						</select>
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="clarity">清晰度</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<select id="clarity" class="form-control" name='clarity'>
							<option value=""
								<c:if test="${seriesEntity.clarity eq null}">selected="selected"</c:if>>请选择</option>
							<c:forEach items="${list_clarity}" var="t">
								<option value="${t.code}"
									<c:if test="${seriesEntity.clarity eq t.code}">selected="selected"</c:if>>${t.name}</option>
							</c:forEach>
						</select>
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="source">来源</label>
				<div class="col-sm-10">
					<div class="clearfix">
						<input class="form-control" name="source" id="source" type="text"
							value="${seriesEntity.source }" placeholder="来源..." />
					</div>
				</div>
			</div>
		</form>
		<div class="hr hr-dotted"></div>
	</div>
</div>
<div class="center">
	<button id="btnAdd" type="button" onclick="show()"
		class="btn btn-success btn-sm">
		<i class="fa fa-user-plus"></i>&nbsp;
		<c:if test="${empty seriesEntity}">
		添加
		</c:if>
		<c:if test="${!empty seriesEntity}">
		保存
		</c:if>
	</button>
	<button id="btn" type="button"
		onclick="webside.common.loadPage('/series/listUI.html<c:if test="${!empty seriesEntity}">?page=${page.pageNum }&rows=${page.pageSize }&sidx=${page.orderByColumn }&sord=${page.orderByType }</c:if>')"
		class="btn btn-info btn-sm">
		<i class="fa fa-undo"></i>&nbsp;返回
	</button>
</div>

<script type="text/javascript">
	function show() {
		var spCodesTemp = "";
		var typename1 = "";
		$('input:checkbox[name=spCodeId]:checked').each(function(i) {
			if (0 == i) {
				spCodesTemp = $(this).val();
				typename1 = $(this).parent().text();
			} else {
				spCodesTemp += ("," + $(this).val());
				typename1 += ("," + $(this).parent().text());
			}
		});
		$("#type").val(spCodesTemp);
		$("#typeName").val(typename1);
		$('#seriesForm').submit();
	}
</script>